<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <title>{$group['name']}</title>
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=yes" name="format-detection" />
    <link rel="stylesheet" href="{$staticHost}css/common.css">
    <script src="{$staticHost}js/jquery.min.js?v=1.8.3"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        var isAppInstalled = "{$isAppInstalled}";
        var isAndroid = false;
        var iPhone = false;
        var userAgent = navigator.userAgent;
        var downloadUrl = "http://mobile.hupu.com/download/joggers?r=share";
        if (userAgent.match("Android")){
            isAndroid = true;
        }else if (userAgent.match("iPhone")){
            iPhone = true;
            downloadUrl = "http://itunes.apple.com/cn/app/hu-pu-pao-bu/id869299193?mt=8";
        }
        var word = '下载虎扑跑步客户端';
        var url = downloadUrl;
        if(isAppInstalled == 1 || isAppInstalled == 3)
        {
             url = "{$group['inviteUrl']}";
        }
        $(".btn-addgroup").attr("href",url);

        if(isAppInstalled == 0 || isAppInstalled == 1)
        {
            pointImg = "{$staticHost}img/wpoint_";
            pointImg += iPhone ? '2' : '1';
            pointImg += '.png?1';
            $("#point").attr("src", pointImg);
        }
        $(".btn-addgroup").click(function(e){
            if(isAppInstalled == 0 || isAppInstalled == 1) //在微信中打开
            {
                // 阻止超链接跳转
                e.preventDefault();
                height = $(document).height();
                $("#shadow").attr("height",height);
                $("div#shadowDiv").addClass("on");
            }
            else if(isAppInstalled = -1)
            {
                // 阻止超链接跳转
                e.preventDefault();
                var startTime = Date.now();
                div = document.createElement('div');
                div.style.visibility = 'hidden';
                div.innerHTML = '<iframe id="schema" src="' + "{$group['inviteUrl']}" + '" scrolling="no" width="1" height="1"></iframe>';
                document.body.appendChild(div);

                var delta = Date.now() - startTime;
                if(delta < 200){
                    setTimeout(function(){
                        window.location.href = downloadUrl;
                    }, 500);
                }
            }
        });
        if(isAppInstalled == 3) // 从微信中跳转到浏览器 已安装
        {
            div = document.createElement('div');
            div.style.visibility = 'hidden';
            div.innerHTML = '<iframe id="schema" src="' + url + '" scrolling="no" width="1" height="1"></iframe>';
            document.body.appendChild(div);
        }
        else if(isAppInstalled == 2) //从微信中跳转到浏览器, 未安装
        {
            window.location.href = downloadUrl;
        }
         $(".shadowDiv").click(function(e){
            $("#shadow").attr("height",0);
            $(this).removeClass("on");
         });
    });
    </script>
<body class="green-bg">
<div class="run-main">
    <div class="run-hmain">
        <div class="run-head">
            <i><img src="{$group['header']}" alt=""/></i>
            <span>{$group['name']}</span>
        </div>
    </div>
    <style>
        .slideBox { position: relative; width:100%; margin:15px auto 0; }
        .slideBox .bd { position: relative; z-index: 30; }
        .slideBox .bd li { position: relative; width: 100%; overflow: hidden; }
        .slideBox .bd li img{width: 100%;}
        .shadowDiv{width:100%;display: none;}
        div.on{display: block;}
        .shadowDiv img {width: 100%;position:absolute;top:0;z-index: 100;}
    </style>
    <!--focus-->
    <div id="slideBox" class="slideBox" sImg="{$sImg}" stitle="{$shareTitle}" surl="{$shareurl}">
        <div class="bd">
            <ul>
                <li><img src="{$staticHost}img/group/r_fbg.jpg"/>
                    <div class="run-fcont">
                        <p>自{$group['addtime']}起，</p>
                        <p>小伙伴们已经在 <span class="ic-red">{$group['citys']}</span>个地方跑步<span class="ic-red">{eval echo round($group['total_mileage'], 2)}</span>km</p>
                        <p>这个群组有点牛，你要不要加入呢！</p>
                    </div>
                </li>
                <li><img src="{$staticHost}img/group/r_fbg.jpg"/>
                    <div class="run-fcont">
                        <p>跑步打卡记录每天<span class="ic-red">跑步动态</span>，</p>
                        <p>早起鸟、长跑冠军都已名花有主，</p>
                        <p>你要不要也来PK一下呢！</p>
                    </div>
                </li>
                <li><img src="{$staticHost}img/group/r_fbg.jpg"/>
                    <div class="run-fcont">
                        <p>群主{$group['hostName']}每月都会创建<span class="ic-red">群目标</span>，</p>
                        <p>新的征程已经开始</p>
                        <p>我们怎能没有你？</p>
                    </div>
                </li>
                <li><img src="{$staticHost}img/group/r_fbg.jpg"/>
                    <div class="run-fcont">
                        <p>战力榜不但有<span class="ic-red">里程榜</span>还有<span class="ic-red">目标榜</span></p>
                        <p>不比距离我们可以比决心么！</p>
                        <p>还不快来一起跑跑跑！</p>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <!--add group-->
    <div class="run-add">
        <img src="{$staticHost}img/group/r_tit.png"/>
        <a class="btn-addgroup" href="javascript:;">加入群组</a>
    </div>
    <div class="shadowDiv" id="shadowDiv">
        <img src="{$staticHost}img/share_shadow.png" id="shadow" />
        <img src="" id="point" />
    </div>
</div>

<script src="{$staticHost}js/TouchSlide.1.1.js"></script>
<script>
    TouchSlide({
        slideCell:"#slideBox",
        mainCell:".bd ul",
        effect:"leftLoop"
    });
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
 (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
 m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
 })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-53856379-2', 'hupu.com');
ga('send', 'pageview');
var shareMsg = $("#slideBox");
var dataForWeixin={
    appId:"",
      TLImg: shareMsg.attr("sImg"),
      url: shareMsg.attr("surl"),
      title: shareMsg.attr("stitle"),
      desc:"虎扑跑步",
      fakeid:"",
      callback:function(){}
};
(function(){
 var onBridgeReady=function(){
 WeixinJSBridge.on('menu:share:timeline', function(argv){
     (dataForWeixin.callback)();
     WeixinJSBridge.invoke('shareTimeline',{
         "img_url":dataForWeixin.TLImg,
         "img_width":"120",
         "img_height":"120",
         "link":dataForWeixin.url,
         "desc":dataForWeixin.desc,
         "title":dataForWeixin.title
         }, function(res){});
     });
 };

 if(document.addEventListener){
 document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
 }else if(document.attachEvent){
 document.attachEvent('WeixinJSBridgeReady',onBridgeReady);
 document.attachEvent('onWeixinJSBridgeReady',onBridgeReady);
 }
 })();

</script>
</body>
</html>